<template>
  <a-drawer
    :title="drewerDB.title"
    placement="right"
    :closable="drewerDB.closable"
    :visible="drewerDB.visible"
    :width="drewerDB.width"
    :after-visible-change="afterVisibleChange"
    @close="onClose"
  >
    <a-table
      :rowKey="
        (record, index) => {
          return index
        }
      "
      :columns="drewerDB.cs"
      :dataSource="data"
      key="index"
      :loading="loading"
      :pagination="false"
    >
      <template slot="footer" style="display:flex">
        <div style="display: inline-flex; justify-content: space-between; align-items: center;margin-left:auto">
          <!-- <a-col style="margin: 0 10px">
            <span>合计</span>
          </a-col> -->
          <a-col style="margin: 0 10px"
            >购买次数：<span style="magin: 0 15px; text-weight: bold; font-size: 18px; color: red">{{
              mNo
            }}</span></a-col
          >
          <a-col style="margin: 0 10px"
            >可退次数：<span style="magin: 0 15px; text-weight: bold; font-size: 18px; color: red">{{
              qNo
            }}</span></a-col
          >
        </div>
      </template>
    </a-table>
  </a-drawer>
</template>
<script>
import { getDetail } from '@/api/cashier/cashier'
export default {
  props: {
    drewerDB: {},
    ids: {},
  },
  computed: {
    mNo: function () {
      let no = 0
      if (this.data.length > 0) {
        for (var i = 0; i < this.data.length; i++) {
          no += this.data[i].rpqty
        }
      }
      return no
    },
    qNo: function () {
      let nos = 0
      if (this.data.length > 0) {
        for (var j = 0; j < this.data.length; j++) {
          nos += this.data[j].rfqty
        }
      }

      return nos
    },
  },
  data() {
    return {
      Bno: 0,
      cno: 0,
      data: [],
      loading: false,
    }
  },
  methods: {
    getSum(total, num) {
      return total + num
    },
    onClose() {
      this.drewerDB.visible = false
    },
    afterVisibleChange(val) {
      console.log(val, this.drewerDB.refundId)
      if (this.ids && val) {
        this.loading = true
        getDetail({ id: this.ids, refundId: this.drewerDB.refundId }).then((res) => {
          this.loading = false
          if (res.code.toString() !== '200' && res.code) {
            this.$message.error(res.msg || res.message)
            return
          }
          if (this.drewerDB.types.toString() !== '5') {
            // this.$message.success(res.msg || res.message)
          }
          this.data = res.rows
          this.subData = res.rows
        })
      }
    },
  },
}
</script>
<style scoped lang="less">
/deep/ .ant-table-footer {
  height: 50px;
  overflow: hidden;
  display: flex;
} 
</style>